{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>文件上传</h1>

{#<form action="" method="post" enctype="multipart/form-data">#}
{#    {% csrf_token %}#}
{#    用户名: <input type="text" name="username">#}
{#    密码: <input type="password" name="password">#}
{#    头像: <input type="file" name="file"> #}
{##}
{#    <input type="submit">#}
{##}
{#</form>#}

{#    {% csrf_token %}#}
{##}
    用户名: <input type="text" id="username">
    密码: <input type="password" id="password">
{#    上传文件: <input type="file" multiple>#}
    上传文件: <input type="file">

    <button id="sub">提交</button>
    <span class="error"></span>

</body>
{#<script src="/static/js/jquery.js"></script>#}
<script src="{% static 'js/jquery.js' %}"></script>
<script src="{% static 'js/jquery.cookie.js' %}"></script>

<script>

    $('#sub').click(function () {

        var formdata = new FormData();

        var uname = $('#username').val();
        var pwd = $('#password').val();

        var file_obj = $('[type=file]')[0].files[0];

        formdata.append('username',uname);
        formdata.append('password',pwd);
        formdata.append('file',file_obj);


        {#var csrf = $('[name=csrfmiddlewaretoken]').val();#}
        {#var csrf = '{{ csrf_token }}';#}


        // $.ajax({
        {#//    url:'{% url "login" %}',#}
        //    type:'get',
        //    success:function (res) {
        //        console.log(res);
        //    }

        //})

        $.ajax({
            url:'{% url "upload" %}',
            type:'post',
            // data:{username:uname,password:pwd,csrfmiddlewaretoken:csrf},
            //data:{username:uname,password:pwd},
            data:formdata,
            processData:false,
            contentType:false,

            headers:{
                "X-CSRFToken":$.cookie('csrftoken'),
            },
            success:function (res) {
                console.log(res);
                if (res === '1'){
                    // $('.error').text('登录成功');
                    location.href = '/home/'; // http://127.0.0.1:8000/home/

                }else{
                    $('.error').text('用户名密码错误!');
                }

            }

        })

    })



</script>

</html>